$colors: (
  base: #236edd,
  bg: #06032f,
  blue: #01daff,
  yellow: #ffe66d,
  red: #fd65b9,
  white: #ffffff,
  purple: #8675f9,
  green: #6bb903,
  gray: #91aabf,
  orange: orange
);

$screen: (
  header-height: 55,
  nav-height: 40,
  title-height: 30,
  spacing: 16,
  half-spacing: 8,
  bg-color: #0a0d48,
);

@function color($name) {
  @return var(--app-color-#{"" + $name});
}

@function size($value) {
  @return calc(#{$value} * var(--app-base-unit));
}